<template>
  <el-dialog
    v-el-drag-dialog
    title="盘点单明细"
    :visible.sync="visible"
    width="1200px"
  >
    <el-form ref="form" class="form" :model="form" label-width="80px">
      <el-form-item label="盘点单号" prop="storeId">
        <el-input v-model="form.stockCheckCode" placeholder="请输入" disabled />
      </el-form-item>
      <el-form-item label="仓库名称" prop="storeId">
        <el-input v-model="form.storeName" placeholder="请输入" disabled />
      </el-form-item>
      <el-form-item label="盘点人员" prop="name">
        <el-input v-model="form.createUser" placeholder="请输入" disabled />
      </el-form-item>
      <el-form-item label="盘点日期">
        <el-date-picker v-model="form.checkDt" style="width: 100%;" type="date" disabled />
      </el-form-item>
      <el-form-item style="width: 100%;" label="备注" disabled prop="name">
        <el-tooltip v-if="form.remark&&form.remark.length>100" class="item" effect="light" :content="form.remark" placement="top">
          <el-input v-model="form.remark" disabled style="width: 100%; padding-right: 8px;" placeholder="请输入" />
        </el-tooltip>
        <el-input v-else v-model="form.remark" disabled style="width: 100%; padding-right: 8px;" placeholder="请输入" />
      </el-form-item>
    </el-form>
    <lb-table
      ref="lbTable"
      border
      height="500px"
      highlight-current-row
      element-loading-text="加载中"
      :column="tableData.column"
      :data="tableData.data"
    />
    <div slot="footer" class="dialog-footer">
      <el-button @click="visible = false">
        关闭
      </el-button>
      <!-- <el-button type="primary" @click="save">
          保存
        </el-button> -->
    </div>
  </el-dialog>
</template>

<script>
  import { repertoryStoreDeatilByOrder, queryMap } from '@/api'
  import { formatColumnMap } from '@/utils'
  // import { formatColumnMap } from '@/utils'
  export default {
    name: 'add',
    props: ['storeMap'],
    data() {
      return {
        visible: false,
        form: {
          date: new Date()
        },
        statusMap: [],
        uuid: 1,
        goodsDetail: {},
        goodsTypesDetailList: [],
        goodsTreeData: [],
        gtObj: {},
        shop: {
          goodsId: null,
          gtId: null
        },
        tableData: {
          column: [
            { type: 'index' },
            // { label: '商品类型', prop: 'gtName', width: 120 },
            // { label: '商品名称', prop: 'goodsName' },
            { label: '规格型号', prop: 'goodsSpec', width: 100 },
            { label: '状态', prop: 'gdStatus', width: 80,
              render: (h, { row }) => <span>    {row.gdStatus && formatColumnMap(this.statusMap, 'value', row.gdStatus, 'desc')} </span>
            },
            { label: '账面库存', prop: 'gdCount', width: 100, align: 'right',
              render: (h, { row }) => {
                return <span>{row.gdCount + (row.unitName || '')}</span>
              }
            },
            { label: '实际库存', prop: 'realCount', width: 100, align: 'right',
              render: (h, { row }) => <span >{row.realCount + (row.unitName || '')} </span>
            },
            { label: '盈/亏数量', prop: 'lessCount', width: 100,
              render: (h, { row }) => <span style={row.lessCount ? 'color:red' : '' }>    {this.lessCountFormat(row)} </span>
            },
            { label: '备注', prop: 'remark', width: 200 }
          ],
          data: []
        }
      }
    },
    methods: {
      async open(row) {
        if (!this.statusMap.length) {
          await this.getGoodStatus()
        }
        const params = {
          stockCheckCode: row.stockCheckCode
        }
        console.log(row)
        const res = await repertoryStoreDeatilByOrder(params)
        if (res.data) {
          this.form = { ...row }
          console.log(res.data)
          if (res.data) {
            var dataArr = []
            var list = res.data
            for (var i = 0; i < list.length; i++) {
              var item = list[i]
              if (list[i].lessCount === 0 && list[i].lessWeight === 0 && list[i].gdCount === 0 && list[i].netWeight === 0) {
                continue
              }
              if (item.pricingMode === 2) {
                item.gdCount = item.netWeight
                item.realCount = item.realNetWeight
                item.lessCount = item.lessNetWeight
              }
              dataArr.push(list[i])
            }
            console.log(this.statusMap)
            console.log(dataArr)
            this.tableData.data = dataArr
          }
        }

        this.visible = true
      },
      // 获取商品状态枚举
      async getGoodStatus() {
        //  GdStatus
        const res = await queryMap({ enumName: 'GdStatus' })
        this.statusMap = res.data
      },
      lessCountFormat(row) {
        var lessCount = row.realCount - row.gdCount
        if (!lessCount) {
          return '正常'
        }
        if (row.pricingMode === 2) {
          lessCount = Number(lessCount).toFixed(2)
        }
        lessCount = lessCount > 0 ? '+' + lessCount : lessCount
        return lessCount
      }
    }
  }
</script>

<style lang="scss" scoped>
.form {
  display: flex;
  flex-wrap: wrap;
  & /deep/ .el-form-item {
    width: 25%;
    // padding-right: 10px;
    .el-form-item__content > .el-select {
      width: 100%;
    }
  }
  .block {
    width: 100%;
  }
}
</style>
